let ItemDiv1=document.getElementsByClassName('itemdiv')   
// console.log(ItemDiv1)
let ItemDiv2=document.querySelectorAll('#div2 .itemdiv')
// console.log(ItemDiv2)

let Ele=document.querySelectorAll('#div1 .itemdiv')
// console.log(Ele)
// for (let i=0;i<ItemDiv2.lenth;i++){
//     ItemDiv2[i].innerHTML='sziit'
//     console.log(ItemDiv2[i].textContent)
// }

let data={
    msg:{
        name:'suki',
        id:'1903010134',
        class:'3-1'
    },
    ImgColor:['#abc123','#Fe0e0e','#564278','#70DB93'],
    ImgSrc:['figure/fig1.png','figure/fig2.png','figure/fig3.png','figure/fig4.png']
}

console.log(data)
console.log(document)

// Ele[0].textContent=data.msg.class
let j=2
for (let i in data.msg){
    console.log(data.msg[i])
    Ele[j].textContent=data.msg[i]
    j=j-1;
}
// 这是是自动设置班级学号姓名的



let cl=document.querySelectorAll('#div2 div') 
cl[0].style.background=data.ImgColor[0]
cl[1].style.background=data.ImgColor[1]
cl[2].style.background=data.ImgColor[2]
cl[3].style.background=data.ImgColor[3]
// 这是使背景颜色生效的
let cll=document.querySelectorAll('#div2 div') 
cll[0].style.border=data.ImgColor[0]
cll[1].style.border=data.ImgColor[1]
cll[2].style.border=data.ImgColor[2]
cll[3].style.border=data.ImgColor[3]

let Imgdiv=document.querySelectorAll('#div3 .itemdiv')
console.log(Imgdiv)

// let NewImgEle=document.createElement('img')
for (let i=0;i<Imgdiv.length;i++){
    console.log(i)
    let NewImgEle=document.createElement('img')
    NewImgEle.src=data.ImgSrc[i]
    Imgdiv[i].textContent=''
    Imgdiv[i].appendChild(NewImgEle)
    console.log(Imgdiv[i])
}

// }
// let ColorDiv=document.querySelectorAll('#div2 div') 
// console.log(ColorDiv)
// for (let i=0;i<ColorDiv.length;i++){
//    ColorDiv[i].style.backgroud=data.ImgColor
//
// let div1ele=document.querySelector('#div1 .itemdiv')
// div1ele.innerHTML='susu'
// console.log(div1ele.textContent)